<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  <title>疫苗接种预约系统</title>
</head>
<script type="text/javascript" src="js/jquery-1.8.3.min.js"></script>
<body>

<form action="ListServlet" >
  <h1>疫苗接种预约系统</h1>
  <input type="text" name="userName" id="userName"> <input type="submit" value="查询">
  <table>
    <tr>
      <th>预约人姓名</th>
      <th>预约人身份证号</th>
      <th>预约状态</th>
      <th>预约接种日期</th>
      <th>操作</th>
    </tr>
    <c:forEach items="${list }" var="item" varStatus="status">
      <tr style="background-color: ${status.index %2==0?'red':''}">
        <td>${item.userName }</td>
        <td>${item.cardId}</td>
        <td>${item.status==0 ? '预约':'已接种'  }</td>
        <td>${item.bookingDate }</td>
        <td><a href="add.jsp">添加</a> <a href="javascript:void(0)" onclick="update(${item.status},${item.id})">完成接种</a>  <a href="javascript:void(0);" onclick="del(${item.id})">删除</a></td>
      </tr>
    </c:forEach>
  </table>
  <span >${info}</span>
  <p>
    <a href="ListServlet?currPage=${param.currPage-3}&pageSize=3">上一页</a>
    <a href="ListServlet?currPage=${param.currPage+3}&pageSize=3">下一页</a>
  </p>
</form>
<script>
  function update(status,id) {
    if (status == 0) {
      var flag = confirm("确定要完成接种吗？")
      if (flag) {
        $.post("UpdateServlet",{"status": 1, "id":id},function () {
          location.href = "ListServlet";
        })
      }
    }else {
      alert("该用户已完成接种");
    }
  }

  function del(id) {
    var f = confirm("确定要删除吗?");
    if(!f){
      return;
    }
    $.get("DeleteServlet?id="+id,function (date) {
      if (date>0){
        alert("删除成功");
      } else{
        alert("删除失败");
      }
      location.href='ListServlet';
    })
  }
</script>
</body>
</html>